<template>
  <div class="app-container">
    <div class="flex-center">
      <el-page-header @back="$router.back()" />
      <el-button-group>
        <el-button type="primary">提交</el-button>
        <el-button type="primary">暂存并关闭</el-button>
        <el-button type="primary">流程图</el-button>
      </el-button-group>
    </div>
    <el-tabs v-model="activeKey" @tab-click="handleClick">
      <el-tab-pane label="基本信息" name="0" />
      <el-tab-pane label="费用明细" name="1" />
      <el-tab-pane label="预算信息" name="2" />
      <el-tab-pane label="核销借款/预付款" name="3" />
      <el-tab-pane label="结算信息" name="4" />
    </el-tabs>
    <div class="base-info">
      <HlCollapse
        title="基本信息"
        :default-show="isShow1"
        @handleIsShow="handleIsShow"
      />
      <div v-show="isShow1" class="base-info-container">
        <HlForm :config="formConfig" />
      </div>
    </div>
    <!-- <HlForm :config="formConfig" /> -->
  </div>
</template>

<script>
import HlForm from '@/components/HlForm'
// import HlConfirm from '@/components/HlConfirm'
import HlCollapse from '@/components/HlCollapse'
export default {
  components: {
    HlCollapse,
    HlForm
    // HlConfirm
  },
  data() {
    return {
      activeKey: '0',
      isShow1: true,
      formConfig: {
        formObj: {
          input: ''
        },
        formList: [
          { type: 'input', label: '公司', prop: 'compony', span: 12, width: '90%' }
        ]
      }
    }
  },
  methods: {
    handleClick(tab) {
      this.activeKey = tab.index
    },
    handleIsShow(value) {
      this.isShow1 = value
    }
  }
}
</script>
